/*
* 2018/03/06
* 书本翻页
* */

$(function () {

    (function () {
        var pageTurning = function (itemObj) {
            if (itemObj.itemArr.length < 3) {
                return false
            }
            this.items = itemObj.itemArr
            this.init()
        }

        pageTurning.prototype = {
            constructor: pageTurning,
            init: function () {
                $('.page-item-3').html(this.items[0])
                $('.page-item-4').html(this.items[1])
                $('.page-item-2').html(this.items[2])
                staticProps.items = this.items
            },
            html: function (obj, _html) {
                obj.innerHTML = _html
            }
        }
        window.pageTurning = pageTurning
        return pageTurning
    })()

    var staticProps = {
        items: [],
        itemWidth: $('.page-item').width(),
        clickIndex: 0,
        canClick: true
    }

    $('.page-item-3').on('click', function () {
        if (staticProps.clickIndex === 0) return
        if (!staticProps.canClick) return

        staticProps.canClick = false

        staticProps.clickIndex--

        $('.page-item-1').html(staticProps.items[staticProps.clickIndex])
        $('.page-item-2').html(staticProps.items[staticProps.clickIndex + 2])

        $(this).addClass('to90 to-left-shadow')
        setTimeout(function () {
            $('.page-item-3').html(staticProps.items[staticProps.clickIndex]).removeClass('to90 to-left-shadow')
            $('.page-item-4').html(staticProps.items[staticProps.clickIndex + 1]).addClass('right-to-0 to-right-shadow')
        }, 1000)

        setTimeout(function () {
            $('.page-item-4').removeClass('right-to-0 to-right-shadow')
            staticProps.canClick = true
        }, 2000)
    })

    $('.page-item-4').on('click', function () {
        if (staticProps.clickIndex === staticProps.items.length - 2) return

        if (!staticProps.canClick) return

        staticProps.canClick = false

        staticProps.clickIndex++

        $('.page-item-2').html(staticProps.items[staticProps.clickIndex + 1])
        $('.page-item-1').html(staticProps.items[staticProps.clickIndex - 1])
        $(this).addClass('to-90 to-right-shadow')
        setTimeout(function () {
            $('.page-item-3').html(staticProps.items[staticProps.clickIndex]).addClass('to0 to-left-shadow')
            $('.page-item-4').html(staticProps.items[staticProps.clickIndex + 1]).removeClass('to-90 to-right-shadow')
        }, 1000)

        setTimeout(function () {
            $('.page-item-3').removeClass('to0 to-left-shadow')
            staticProps.canClick = true
        }, 2000)
    })
})